Progressive Partial Rendering

❓질문

Progressive Partial Rendering(PPR)에 대해서 설명해주세요.


💡 조사하기전 내가 알고 있던 내용

뜻을 보면 프로세스를 부분적으로 렌더링하는 기법인것 같습니다 제가 알고있는 방법에는 SSR과 CSR을 장점을 합쳐 사용하는 점진적 하이드레이션 기법을 예로 들 수 있을것같습니다.

이러한 부분적으로 렌더링하는 기법의 장점으로는 렌더링의 우선순위를 정하여 렌더링을 할 수 있다는 점이 가장 큰 장점이라고 할 수 있을것 같습니다.

우선 순위를 매기는 점수를 각 컴포넌트에 부여하여 해당 컴포넌트가 렌더링이 오래걸리는 무거운 컴포넌트이고 사용자 인터렉션이 없는 경우 우선순위를 후순위로 미루어 사용자 인터렉션 기능이 있는 컴포넌트를 우선적으로 렌더링하고 후에 렌더링을 하여 UX를 보다 효과적으로 상승시키는 효과를 볼 수 있습니다.


🏫 정리한 내용

PPR과 Lazy Loading의 차이를 들어 보충 설명하면 좋을 것 같습니다.
Lazy Loading은 주로 뷰포트 밖에있는 이미지등에 적용하는 최적화 기법이며 해당 컴포넌트가 뷰포트에 들어올때 렌더링하여 리소스를 필요한 시점에 불러오는 기법입니다.
PPR은 이 보다 더 넓은 범위의 개념이며 Lazy Loading , Streaming SSR등은 PPR을 구현하는 가법 중에 하나라고 볼 수 있습니다.